<template>
  <div class="container">
    <data-tree :data="dataList" :shark='shark'/>
    <div :class="{'btnShark':btnCheck,'active': shark }" @click="toggleShark"><i class="fa fa-retweet" aria-hidden="true"></i></div>
  </div>
</template>
<script>
import {get} from '@/util'
import linkCross from '@/components/weapon/LinkCross'
import linkExtend from '@/components/weapon/LinkExtend'
import linkLine from '@/components/weapon/LinkLine'
import linkBlank from '@/components/weapon/LinkBlank'
import wdata from '@/components/weapon/Wdata'
import dataTree from '@/components/weapon/DataTree'
import sharkBar from '@/components/weapon/SharkBar'
export default {
  data () {
    return {
      dataList: [],
      shark: false,
      btnCheck: true
    }
  },
  components: {
    linkCross,
    linkExtend,
    linkLine,
    linkBlank,
    wdata,
    dataTree,
    sharkBar
  },
  methods: {
    async getData () {
      wx.showNavigationBarLoading()
      const infoData = await get('/weapp/wlist')
      this.dataList = infoData
      wx.hideNavigationBarLoading()
    },
    toggleShark () {
      this.shark = !this.shark
    }
  },
  mounted () {
    this.getData()
  },
  onLoad: function (options) {
    // 设置导航条
    wx.setNavigationBarTitle({
      title: options.text
    })
    // 大图
    this.type = options.type
  }
}
</script>
<style>
.box {
  width: 36px;
  height: 40px;
  vertical-align: top;
  display:inline-block;
}
.box-item{
  width:50%;
  height:50%;
  float:left;
  box-sizing: border-box;
}
.border-bottom{
  border-bottom:3px solid #233142;
}
.border-right{
  border-right:3px solid #233142;
}
.border-top{
  border-top:3px solid #233142;
}
.line-div{
  background-color: #ffffff;
  padding: 0;
  margin: 0;
}
.box-data{
  height: 40px;
  margin-left: 10px;
  line-height: 40px;
  width: auto;
  vertical-align: top;
}
.btnShark{
  position: fixed;
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  line-height: 30px;
  text-align: center;
  background-color: #607D8B;
  color: #ffffff;
  right: 20px;
  bottom: 20px;
}
.btnShark.active {
   background-color: #0084ff;
  color: #ffffff;
}
</style>


